﻿<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<!--[if lt IE 9]>
<script type="text/javascript" src="lib/html5shiv.js"></script>
<script type="text/javascript" src="lib/respond.min.js"></script>
<![endif]-->
<link rel="stylesheet" type="text/css" href="static/h-ui/css/H-ui.min.css" />
<link rel="stylesheet" type="text/css" href="lib/Hui-iconfont/1.0.8/iconfont.css" />
<link rel="stylesheet" type="text/css" href="static/h-ui.admin/css/H-ui.admin.css" />
<link rel="stylesheet" type="text/css" href="static/h-ui.admin/skin/default/skin.css" id="skin" />
<style type="text/css">
.table>tbody>tr>td{  
        text-align:center;  
}  
/* dataTables表头居中 */  
.table>thead:first-child>tr:first-child>th{  
        text-align:center;  
}  
</style>
<!--[if IE 6]>
<script type="text/javascript" src="lib/DD_belatedPNG_0.0.8a-min.js" ></script>
<script>DD_belatedPNG.fix('*');</script>
<![endif]-->
<title>订阅接口</title>
</head>
<body>
<div class="page-container">
	<div class="text-c mt-20">
		邮件日期：
		<input type="text" onfocus="WdatePicker({readOnly:true,maxDate:'%y-%M-%d'})" id="date" class="input-text Wdate" style="width:120px;">
		状态：
		<span class="select-box inline">
			<select name="" class="select" id="zt">
				<option value="">全部</option>
				<option value="0">解密成功</option>
				<option value="1">无解密附件</option>
				<option value="2">收件人或抄送人中不存在领导</option>
				<option value="3">解密失败</option>
			</select>
		</span>
		<input type="text" name="" id="qt" placeholder="发件人、收件人、抄送人、主题...." style="width:300px" class="input-text">
		<button name="" id="find" class="btn btn-success" type="submit"><i class="Hui-iconfont">&#xe665;</i> 搜索</button>
	</div>
	<div class="line mt-40"></div>
	<div class="mt-20">
		<table id="table" class="table table-border table-bordered table-bg table-hover table-sort table-responsive">
			<thead>
				<tr class="text-c">
					<th width="30">行号</th>
					<th width="150">发件人</th>
					<th width="150">收件人</th>
					<th width="150">抄送人</th>
					<th width="150">主题</th>
					<th width="100">附件</th>
					<th width="200">状态</th>
					<th width="150">邮件日期</th>
				</tr>
			</thead>
		</table>
	</div>
</div>
<!--_footer 作为公共模版分离出去-->
<script type="text/javascript" src="lib/jquery/1.9.1/jquery.min.js"></script> 
<script type="text/javascript" src="lib/layer/2.4/layer.js"></script>
<script type="text/javascript" src="static/h-ui/js/H-ui.min.js"></script> 
<script type="text/javascript" src="static/h-ui.admin/js/H-ui.admin.js"></script> <!--/_footer 作为公共模版分离出去-->

<!--请在下方写此页面业务相关的脚本-->
<script type="text/javascript" src="lib/My97DatePicker/4.8/WdatePicker.js"></script> 
<script type="text/javascript" src="lib/datatables/1.10.0/jquery.dataTables.min.js"></script> 
<script type="text/javascript" src="lib/laypage/1.2/laypage.js"></script>
<script type="text/javascript">
var table;
$(document).ready(function () {
	table=$("#table").DataTable({
		"language": {
            "sProcessing": "处理中...",
            "sLengthMenu": "每页_MENU_条 ",
            "sZeroRecords": "没有匹配结果",
            "sInfo": "显示第 _START_ 至 _END_ 项结果，共 _TOTAL_ 项",
            "sInfoEmpty": "显示第 0 至 0 项结果，共 0 项",
            "sInfoFiltered": "(由 _MAX_ 项结果过滤)",
            "sInfoPostFix": "",
            "sSearch": "搜索:",
            "sUrl": "",
            "sEmptyTable": "表中数据为空",
            "sLoadingRecords": "载入中...",
            "sInfoThousands": ",",
            "oPaginate": {
                "sFirst": "首页",
                "sPrevious": "上页",
                "sNext": "下页",
                "sLast": "末页"
            }
            },
            "aLengthMenu": [15, 30, 50],
            "bAutoWidth": false,
            "bDeferRender": true,
            "bLengthChange": true,
            "sAjaxSource": "find/all",
            "bPaginate": true,
            "bServerSide": true,
            "bSort": false,
            "iDisplayLength": 15,
            "searching": false,//是否显示搜索框
            "bFilter": true,
            "bProcessing": true,
            "fnServerData":retrieveData,
        	"columns": [
                    {"data": "ID",},
    	            {"data": "SENDNAME",
    	            	"render": function ( data, type, row, meta ) {  
    	            		return '<div class="text-overflow"  style="width:150px;">'+data+'</div>';
    	            	}
    	            },
    	            {"data": "ADDRESSENAME",
    	            	"render": function ( data, type, row, meta ) {  
    	            		return '<div class="text-overflow"  style="width:150px;">'+data+'</div>';
    	            	}
    	            },
    	            {"data": "CCRNAME",
    	            	"render": function ( data, type, row, meta ) {  
    	            		return '<div class="text-overflow"  style="width:150px;">'+data+'</div>';
    	            	}
    	            },
             		 {"data": "SUBJECT",
    	            	"render": function ( data, type, row, meta ) {  
    	            		return '<div class="text-overflow"  style="width:150px;">'+data+'</div>';
    	            	}},
                     {"data": "ACCESSORY",
    	            	"render": function ( data, type, row, meta ) {  
    	            		return '<div class="text-overflow"  style="width:150px;">'+data+'</div>';
    	            	}},
                     {"data": "STATUS",
        	            	"render": function ( data, type, row, meta ) { 
        	            		if(data=="1"){
        	            			return "无解密附件";
        	            		}else if(data=="2"){
        	            			return "收件人或抄送人中不存在领导";
        	            		}else if(data=="3"){
        	            			return "解密失败";
        	            		}else{
        	            			return "解密成功";
        	            		}
        	            	}},
                     {"data": "TIME"}
        ]
});
	
});


function retrieveData(sSource, aoData, fnCallback ) {
	aoData.push(  {"name":"date", "value":$("#date").val()}, 
        	{"name":"zt", "value":$("#zt").val()},
            {"name":"qt", "value":$("#qt").val()}	     
	);
    $.ajax({
        url : 'find/all',//这个就是请求地址对应sAjaxSource
        data : aoData,//这个是把datatable的一些基本数据传给后台,比如起始位置,每页显示的行数
        type : 'get',
        success : function(result) {
            fnCallback(result);//把返回的数据传给这个方法就可以了,datatable会自动绑定数据的
        },
        error : function(msg) {
        	 layer.msg("查无数据！");
        }
    });
}


$("#find").click(function(){
	table.ajax.reload();
}); 

$(document).on('mouseover','.text-overflow',function(){
	layer.tips(jQuery(this).text(),jQuery(this), {
		tips: [2, '#5eb95e'],
		time: 0
		});
});


$(document).on('mouseout','.text-overflow',function(){
		layer.closeAll('tips');
});

</script> 
</body>
</html>